<template>
  <div class="_staffUploadCode">
    <van-form @submit="formSubmitted" ref="form">
      <van-field
        name="uploader"
        label="上传群二维码"
        :rules="[{ validator:uploadValidator, message: '请上传二维码' }]"
      >
        <template #input>
          <van-uploader v-model="form.fileList" :max-count="1" />
        </template>
      </van-field>
    </van-form>
    <div class="btnCon">
      <van-button class="opeBtn bgPrimary" round @click="submitClick">提交</van-button>
    </div>
  </div>
</template>

<script>
import { mapActions, mapMutations } from "vuex";
import { Form, Field, Button, Toast, Dialog, Uploader } from "vant";
export default {
  components: {
    [Form.name]: Form,
    [Field.name]: Field,
    [Button.name]: Button,
    [Toast.name]: Toast,
    [Uploader.name]: Uploader,
  },
  data() {
    return {
      form: {
        fileList: [],
      },
    };
  },
  methods: {
    ...mapActions({
      uploadFile: "agent/uploadFile",
    }),
    formSubmitted() {
      let sendData = {
        params: {},
      };
      let fd = new FormData();
      // fd.append("crowdName", this.form.groupName);
      // fd.append("wxOpenId", this.$store.state.userId);
      this.form.fileList.forEach((e) => {
        fd.append("file", e.file);
      });
      sendData.fd = fd;
      console.log("sendData", sendData);
      this.uploadFile(sendData)
        .then((res) => {
          console.log(res);
          if (res && (res.accessPath || res.code == 0)) {
            Toast.success("上传成功");
          }
        })
        .catch((err) => {
          console.log(err);
        });
    },
    uploadValidator(val) {
      console.log(val);
      if (val.length != 1) {
        return false;
      }
      return true;
    },
    submitClick() {
      this.$refs.form.submit();
    },
  },
};
</script>

<style lang="scss">
._staffUploadCode {
  background-color: white;
  min-height: 100vh;
  .opeBtn {
    width: 100%;
    font-size: 50px;
    height: 130px;
  }
  .btnCon {
    padding: 24px;
  }
  .tips {
    color: grey;
    font-size: 36px;
    padding: 30px;
  }
}
</style>